StockPriceChart.tsx 879 B

12345678910111213141516171819202122232425262728293031
  1. 'use client';
  2. import './price-chart.scss';
  3. import dynamic from 'next/dynamic';
  4. import type { StockPriceRow } from '@/types/stock';
  5. // recharts(d3) 지연 로드 — 상단 요약/표 페인트 뒤 차트 청크를 client-only(ssr:false)로 로드해 first-load JS 축소.
  6. const PriceChartInner = dynamic(() => import('./PriceChartInner'), {
  7. ssr: false,
  8. loading: () => (
  9. <div className='stock-chart stock-chart--flat'>
  10. <div className='stock-chart__canvas' aria-hidden='true' />
  11. </div>
  12. )
  13. });
  14. type Props = {
  15. // GetDetail.recentPrices — 최신순(newest-first)
  16. prices: StockPriceRow[];
  17. name: string;
  18. };
  19. export default function StockPriceChart({ prices, name }: Props)
  20. {
  21. // 데이터 2개 미만이면 미표시 (하단 일별 시세 표로 대체)
  22. if (!prices || prices.length < 2) {
  23. return null;
  24. }
  25. return <PriceChartInner prices={prices} name={name} />;
  26. }